<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>con_placer 2011</title>
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/text.css" />
<link rel="stylesheet" href="css/960.css" />
<style>

body {
	background:black;
}

#wrapper {
	background:#ccc;	
color:#CBC4C2;
font-family:"Helvetica Neue",arial;
font-weight:300;	
}

#header {
	background:#222;	
	height:100px;
}

#header a {
    text-decoration:none;
    color:#C93C3E;
}


#main {
	background:#000;	
	height:800px;
}


#sidebar {
	background:#000;	
	min-height:580px;
	color: #F29E07;
}

#sidebar h1 {
    font-size:28px;
    font-weight:bold;
}

#sidebar h2 {
    font-size:24px;
    font-weight:bold;
}


#sidebar p {
    font-size:20px;
}



#footer {
	background:#C93C3E;	
	border-top:10px solid #222;
	color:white;
	height:200px;
}


.clearfix {
	display:block;
}

/* nav */



#nav {
	float: right;
	margin: 10px 0 0 30px;
	color: #777;
	list-style: none;
	}
#nav li {
	float: left;
	margin: 0 4px 0 0;

	}
#nav li a {
	float: left;
	padding: 5px 10px;
	text-decoration: none;
	/*color: #bbbfc3;*/
	color: #F29E07;
	font-size: 18px;
	font-weight:bold;
	}
#nav li a:hover {
	color: white;
	background: rgba(255,255,255,.12) url(../img/glass-light.png) repeat-x 0 50%;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	}
	
	.lista-footer {
	    float: left;
	    color: white;
	    padding-left:15px;
	    padding-right:15px;
	}
	
	.lista-footer ul {
	    list-style:none;
	}
	
	.lista-footer li {
	    margin:0px;
	}
	
	
	.lista-footer h4 {
	    color: black;
	    margin-bottom:8px;
	}
	
	.facebook {
	    float:right;
	    margin-top:20px;
	}
	
	.facebook p {
	   margin-top:2px;
	   float:left;
	   padding-right:15px;
	   font-size:18px;
	   
	}
	
	#logo {
	    margin-top:8px;
	}
	
	.foto-grande {
	    background:#222;
	    height:270px;
	}
	
	


</style>
</head>
<body>

	<div id="wrapper">
	
		<div id="header" class="container_16 clearfix">
		
				<div class="grid_9">
					<div id="logo">
						<h1><a href="#"><img src="img/logo-grande.png"/></a></h1>
					</div>
				</div>
				
  			   <div class="grid_6 prefix_1">
                    <div id="navegacion" style="width:400px;float:right;margin-top:40px;">
                        <ul id="nav" class="clearfix">
                            <li><a href="#">Reservas</a></li>
                             <li><a href="#">Dónde</a></li>
                            <li><a href="#">Quién</a></li>
                            <li><a href="#">Cuándo</a></li>
                        </ul>
                    </div>  			   
  			   </div>
				
		</div>
		
		<div id="main" class="container_16">
		
		</div>
		
		<div id="footer">
		<div class="container_16">
					<div class="lista-footer">
					<h4>Con_placer 2011</h4>
					<ul>
					    <li>Reservas</li>
					    <li>Dónde estamos</li>
					    <li>Quiénes somos</li>
					</ul>
					</div>
					
					<div class="lista-footer">
					<h4>Más información</h4>
					<ul>
					    <li>Cómo reservar</li>
					    <li>Precios</li>
					    <li>Fechas</li>
					</ul>
					</div>
					
					<div class="facebook">
					    <p>Síguenos en</p> 
					    <img src="img/icon_facebook.png" />
					</div>
			</div>
		</div>
		
	
	
	</div>





</body>
</html>